<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="author" content="Wayou">
    <meta name="description" content="hichat | a simple chat application built with node.js and websocket">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>chat room</title>
    <link rel="stylesheet" href="styles/main.css">
    <link rel="stylesheet" type="text/css" href="styles/chat.css">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="icon" href="favicon.ico" type="image/x-icon">
</head>

<body>
    <div class="wrapper">
        <div class="header">welcome to chat room!</div>
        <div id="historyMsg">
        </div>
        <div class="controls">
            <div class="items">
                <input id="colorStyle" type="color" placeHolder='#000' title="font color" />
                <input id="emoji" type="button" value="emoji" title="emoji" />
                <label for="sendImage" class="imageLable">
                    <input type="button" value="image" />
                    <input id="sendImage" type="file" value="image" />
                </label>
                <input id="clearBtn" type="button" value="clear" title="clear screen" />
            </div>
            <textarea id="messageInput" placeHolder="enter to send"></textarea>
            <button id="sendBtn" value="SEND">SEND</button>
            <div id="emojiWrapper">
            </div>
        </div>
    </div>
    <script src="/socket.io/socket.io.js"></script>
    <script type="text/javascript" src="scripts/module.js"></script>
    <script type="text/javascript" src="scripts/jquery.min.js"></script>
    <script src="scripts/chat.js"></script>
</body>

</html>
